﻿{extend name="public:base" /}

{block name="content"}
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-title">
                    <div class="row">
                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <input placeholder="请输入问卷预览地址" type="text" id="url" class="form-control form-control-lg">
                            </div>
                        </div>
                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <button type="button" class="btn btn-primary btn-lg" id="addQuestion">新增问卷</button>
                            </div>
                        </div>
                    </div>

                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="iconfont icon-chevron-up"></i>
                        </a>
                    </div>
                </div>

                <div class="ibox-content">
                    <div class="row search-form">
                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <input placeholder="请输入问卷名" name="title" value="{:input('title')}" type="text" class="form-control form-control-lg">
                            </div>
                        </div>
                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <button type="button" class="btn btn-primary btn-lg screen-btn">搜索</button>
                            </div>
                        </div>
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th width="10%">问卷名</th>
                                <th width="10%">问卷预览地址</th>
                                <th width="10%">已作答 / 总作答</th>
                                <th width="10%">单套问卷作答时长</th>
                                <th width="35%">新增规则</th>
                                <th width="10%">自动答题程序</th>
                                <th width="15%">操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            {volist name="list" id="vo"}
                            <tr>
                                <td>{$vo.title}</td>
                                <td>{$vo.url}</td>
                                <td>{$vo.answer_count} / {$vo.all_answer_count}</td>
                                <td>{$vo.single_answer_time ?: 0}秒</td>
                                <td>
                                    {volist name="vo.user_rule" id="v" key="k"}
                                    {if count($v)}
                                    第{$k}题：
                                    {volist name="v" id="vv" key="kk"}
                                    选项{$kk}：{$vv}%
                                    {/volist}
                                    <br />
                                    {/if}
                                    {/volist}
                                </td>
                                <td>{:getStatusDesc($vo.status)}</td>
                                <td class="project-actions">
                                    <!--{if !$vo.is_train}
                                    <a href="{:url('aiTrain', ['id' => $vo.id])}" class="btn btn-white btn-sm"><i class="iconfont icon-peizhi"></i> AI训练 </a>
                                    {/if}-->
                                    {if $vo.plan_count == 0}
                                    <a href="{:url('setQuestionRule', ['id' => $vo.id])}" class="btn btn-white btn-sm"><i class="iconfont icon-peizhi"></i> 设置问卷作答规则 </a>
                                    <a onclick="AiAnswer({$vo.id})" class="btn btn-white btn-sm ai-answer"><i class="iconfont icon-news"></i> AI作答 </a>
                                    {/if}
                                    <a href="{:url('planList', ['id' => $vo.id])}" class="btn btn-white btn-sm"><i class="iconfont icon-news"></i> 答题进度列表 </a>
                                    <a href="{:url('delQuestion', ['id' => $vo.id])}" class="btn btn-white btn-sm ajax-del"><i class="iconfont icon-trash"></i> 删除
                                    </a>
                                </td>
                            </tr>
                            {/volist}
                            </tbody>
                        </table>
                        {if !empty($list)}{$list->render()}{/if}
                    </div>

                </div>
            </div>
        </div>

    </div>
</div>

{/block}

{block name="js"}
<script>
    $('#addQuestion').click(function () {
        var url = $('#url').val();
        $.post('/admin/manage/addQuestion', {
            url
        }, res => {
            if (res.result == 1) {
                window.location.reload();
            } else {
                // 提示错误
                layer.msg(res.msg)
            }
        }, 'JSON')
    })
    // Step 1: 封装 POST 请求为一个 Promise
    function postData(url, data) {
        return new Promise((resolve, reject) => {
            $.post(url, data, function(response) {
                if (response.result == 1) {
                    resolve(response);  // 请求成功，返回数据
                } else {
                    reject(new Error(response.msg));  // 请求失败，抛出错误
                }
            }, 'JSON')
              .fail(function(jqXHR, textStatus, errorThrown) {
                  reject(new Error('请求失败: ' + textStatus));  // 处理 AJAX 请求失败的情况
              });
        });
    }

    // Step 2: 使用 async/await 处理 POST 请求
    async function submitForm(id) {
        try {
            // 提示“AI作答花费时间较长，请稍后再来查看结果”
            layer.msg('AI作答花费时间较长，请稍后再来查看结果', { icon: 1 });

            // 发起异步请求并等待结果
            await postData('/admin/manage/aiAnswer', { id });

            // 延时刷新页面以便用户能看到提示
            setTimeout(() => {
                window.location.reload();  // 延迟1秒刷新
            }, 1000);  // 延迟1秒刷新
        } catch (error) {
            // 处理请求失败的情况
            layer.msg(error.message, { icon: 2 });
            // 延时刷新页面以便用户能看到提示
            setTimeout(() => {
                window.location.reload();  // 延迟1秒刷新
            }, 1500);  // 延迟1秒刷新
        } finally {
            // 请求完成后移除加载提示
            layer.closeAll('loading');
        }
    }

    // Step 4: 封装点击事件，调用 submitForm
    function AiAnswer(id) {
        swal({
            title: "您确认要执行该操作吗？",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#1BBF80",
            confirmButtonText: "确认",
            cancelButtonText: "取消",
            closeOnConfirm: false,
            closeOnCancel: true
        }, function(isConfirm) {
            if (isConfirm) {
                // 用户点击了确认，执行操作
                submitForm(id);
            } else {
                // 用户点击了取消
                swal("已取消", "操作已被取消。", "error");
            }
        });
    }


</script>{/block}
